<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>DTXMB - Order Page</title>
    <link href="<c:url value=" /resources/css/mypage/toolkit-inverse.css " />" rel="stylesheet">
    <link href="<c:url value=" /resources/css/mypage/application.css " />" rel="stylesheet">
    <!-- Icon Image -->
	<link rel="shortcut icon" href="<c:url value="/resources/image/favicon.ico" />" />
</head>

<body>
    <div class="bw">
        <div class="fu">
            <div class="ge aom">
                <nav class="aot">
                    <div class="aon" style="text-align: center;">
                        <div>
                            <a href="/"><img src="<c:url value=" /resources/image/Zombie0.png " />" style="width:48px;height:48px;"></a>
                        </div>
                    </div>
                    <div class="collapse and" id="nav-toggleable-sm">
                        <ul class="nav of nav-stacked" style="text-align:center;">
                        	<li class="tq">Dashboards</li>
                            <li><a href="/mypage">Overview</a></li>
                            <li class="active"><a href="/order/page/1">Orders</a></li>
                            <li><a href="/shoppingcart">Shopping Cart</a></li>
                            <li><a href="#">My Address</a></li>
                            <li class="tq">More</li>
                            <li><a href="#">New Product</a></li>
                            <li><a href="#">Contact DTXMB</a></li>
                        </ul>
                        <hr class="rw aky">
                    </div>
                </nav>
            </div>
            <div class="hc aps">
                <div class="apa">
                    <div class="apb">
                        <!-- <h6 class="apd">Dashboards</h6> -->
                        <h2 class="apc">Orders</h2>
                    </div>
                    <div class="ob ape" style="width:260px; margin-top:8px;">
                        <div class="tn aol">
                            <input type="text" style="padding-left:15px;" value="01/01/15 - 01/08/15" class="form-control" data-provide="datepicker">
                        </div>
                        <span class="ce apn ame">Search</span>
                    </div>
                </div>
                <div class="anv alg ala">
                    <h3 class="anw anx">Order History</h3>
                </div>
                <div class="fu apt">
                    <div class="gq gg ala" style="width:100%;">
                        <div class="apu anp">
                            <div class="alz">
                                <span class="anj" style="font-weight:700">Order History</span>
                                <h2 class="ani">1209<small class="ank anl">5%</small></h2>
                                <hr class="ans akt">
                            </div>
                            <canvas id="sparkline1" width="100%" height="47" class="apv" data-chart="spark-line" data-value="[{data:[28,68,41,43,96,45,100]}]" data-labels="[&#39;a&#39;,&#39;b&#39;,&#39;c&#39;,&#39;d&#39;,&#39;e&#39;,&#39;f&#39;,&#39;g&#39;]" style="width: 189px; height: 47px;"></canvas>
                        </div>
                    </div>
                </div>
                <hr class="aky">
               
                <div class="by">
                    <h4 class="ty">All Orders</h4>
                    <c:forEach var="st" items="${orders}">
                   	    <a class="ph" href="/order/${st.id}" target="_blank">
                   	    	<!-- 转换数字，以及定义数字格式 -->
                            <span style="font-size:16px;color:#FFFFFF" class="dy dh">$<fmt:formatNumber value="${st.amout}" type="number"/></span>
                            <!-- 转换日期，以及定义日期格式 -->
                            <span style="font-size:16px"><fmt:formatDate value="${st.createtime}" pattern="yyyy-MM-dd HH:mm:ss" /></span>
                    	</a>
                    </c:forEach>
                </div>
                <c:if test="${pageNumber == 1}">
                	<!-- Do Nothing -->
                </c:if>
                <c:if test="${pageNumber > 1}">
	                <div class="db">
						<ul class="ow">
					    	 <c:forEach var="st" items="${listPage}">
					    	 	<c:if test="${currentPage == st}">
					    	 		<li class="active"><a href="/order/page/${st}">${st}</a></li>
					    	 	</c:if>
					    	 	<c:if test="${currentPage != st}">
					    	 		<li><a href="/order/page/${st}">${st}</a></li>
					    	 	</c:if>
					    	 </c:forEach>
					  	</ul>
					</div>
				</c:if>
                <!-- <a href="http://bootstrap-themes.github.io/dashboard/index.html#" class="ce apn ame">View all devices</a> -->
            </div>
        </div>
    </div>
    
    <script src="<c:url value=" /resources/js/mypage/jquery.min.js " />"></script>
    <script src="<c:url value=" /resources/js/mypage/chart.js " />"></script>
    <script src="<c:url value=" /resources/js/mypage/tablesorter.min.js " />"></script>
    <script src="<c:url value=" /resources/js/mypage/toolkit.js " />"></script>
    <script src="<c:url value=" /resources/js/mypage/application.js " />"></script>
</body>

</html>